import 'package:flutter/material.dart';
import 'package:flutter_jd/pages/tabbar/category/view.dart';
import 'package:flutter_jd/pages/tabbar/home/controller.dart';
import 'package:flutter_jd/ui/widgets/kit.dart';
import 'package:get/get_state_manager/get_state_manager.dart';
import 'package:get/route_manager.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class SlideNav extends GetWidget<HomeController> {
  @override
  Widget build(BuildContext context) {
    return Container(
      height: 30.h,
      margin: EdgeInsets.only(top: 5.h),
      padding: EdgeInsets.only(left: 1.w),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Expanded(
            child: ListView(
              scrollDirection: Axis.horizontal,
              children: List.generate(
                controller.list.length,
                (index) => GestureDetector(
                  onTap: () {
                    controller.navIndex.value = index;
                  },
                  child: Obx(
                    () => Container(
                      padding: EdgeInsets.symmetric(horizontal: 10.w),
                      child: Column(
                        children: [
                          Text(
                            controller.list[index],
                            style: TextStyle(
                              color: Colors.white,
                              fontSize: controller.navIndex.value == index
                                  ? 18.sp
                                  : 16.sp,
                              fontWeight: controller.navIndex.value == index
                                  ? FontWeight.bold
                                  : FontWeight.w400,
                            ),
                          ),
                          Container(
                            width: 16.w,
                            height: 2.8.h,
                            decoration: BoxDecoration(
                              color: controller.navIndex.value == index
                                  ? Colors.white
                                  : Colors.transparent,
                              borderRadius: BorderRadius.circular(3.r),
                            ),
                          )
                        ],
                      ),
                    ),
                  ),
                ),
              ),
            ),
          ),
          _buildRIghtButon()
        ],
      ),
    );
  }

  Widget _buildRIghtButon() {
    return Container(
      height: 21.h,
      padding: EdgeInsets.only(right: 12.w),
      child: Row(
        children: [
          Container(
            width: 3.w,
            height: 16.h,
            margin: EdgeInsets.only(top: 2.h, right: 5.w),
            decoration: BoxDecoration(
              gradient: LinearGradient(
                begin: Alignment.topLeft,
                end: Alignment.topRight,
                colors: [
                  Colors.black.withOpacity(0.02),
                  Colors.black.withOpacity(0.1)
                ],
              ),
            ),
          ),
          GestureDetector(
            onTap: () {
              Get.to(() => Category(arguments: {'back': true}));
            },
            child: Row(
              children: [
                Container(
                  margin: EdgeInsets.only(right: 3.w),
                  child: Kit.iconFont(0xe607, Colors.white, 16.6.sp),
                ),
                Text(
                  '分类',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 15.sp,
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    );
  }
}
